其他
两年经验前端社招中大厂面经(下)
作者:Hh
https://juejin.cn/post/7335721246929780771
接上篇:两年经验前端社招中大厂面经(上)
阿里巴巴飞猪
飞猪是提前在线上做题,写一个旅游相关的demo:有 tab 切换、商品信息等,做完之后约的一面
总体来说,问的都很基础,只是自己答得不好,非常菜~
前端一面(挂)
什么是原型对象,以及你对原型的机制了解是什么样子的 JS的继续,你会用哪些方式去实现呢? 有哪些方式可以隐藏页面的元素 你说的这几种方式 哪些会引起页面的重排 哪些操作会引起页面的重排 那如果要操作dom元素的话,你有什么方案去减少 重排和重绘? 如果你要做一个长列表的图片,是这种无尽流的这种,然后你有什么方式可以 提升交互的体验,优化一下页面的性能呢?图片的懒加载:三种方案 那你的后面是这两种方法:是怎么实现的图片懒加载呢? 你用的 React 比较多是吧 React hook 解决了哪些问题,以及有哪些常用的hooks useCallback 和 useMemo 的区别 React 项目的页面上有非常多的组件,你有什么方式加快首屏渲染? 你刚才 提到了 SSR,SSR的渲染速度它 其实 取决的因素还是挺多的,那如果你的整个页面的内容非常的多,接口也比较慢的话,那你有什么方式 可以进一步加快 SSR的首屏呢? 可能你的页面有5 、6 屏,你的接口也非常慢,其中有两个模块接口非常慢,那这种情况下 你有什么方案优化首屏呢? 网络和浏览器相关的:计算机网络的五层结构 https 是怎么保障安全的? CDN 具体是 怎么实现的吗? 低代码项目经历:balabala 你在这个项目做了多久 你能讲一下这一个的整个实现链路吗?低代码的实现链路 那你们这个 组件的打包构建是 你们自己做的吗? 那你讲一下你做的这些项目里面,刚才提到的点之外,还有哪一个技术对你来说,是比较难的,也比较有挑战性的 所以你主要负责那一个模块呢? 你有做过移动端的东西吗? 小程序也没有是吗? 你为什么想换工作呢? 反问 工作地点:杭州 工作节奏
挚文集团(探探)
算法有一步没写出来,有测试用例没有通过
前端一面(挂)
自我介绍 基础知识 移动端的实际开发经验有吗?移动端相关的技能 聊一聊你对前端代码的语义化了解 CSS BFC 的了解,你可以随便发散 display:flex 介绍它的相关属性,还有它平时怎么使用 平时做过的项目有对兼容性有要求吗?是谷歌为主吧,那谷歌文字最小是多少px? 12px,有什么方法缩小吗? transform: scale 缩小,存在的问题:比如说 我正好有一个文案,正好有4个字,后面跟了一个 icon图标,那如果说我要设置 8px, 16px 需要缩小50% 对吧,那它和后面的 icon的距离怎么办,它和后面的 icon 又不连续了 这个问题比较偏于实战,处理的方法很多,比如 单独特殊处理 icon,或者整体把 他们缩小, 说 一些数组的常用方法 举一个场景:这个数组先取出 特殊的属性,从一个对象数组变成 一个 字符串数组,我只要对象里面的一个key,key值是一个字符串。返回key 得到一个字符串数组,然后基于这个 key 做一些过滤 这个代码有什么好处,有什么缺点:复杂度太高了?map 和 filter 底层是循环 但是数组的其他方法也可以解决:reduce 第一种 和 第二种区别:灵活性更高,第一个是 有好处的,语义化更好。。。
arr.map(() => {}).filter(() => {}); // 这段代码由优化的吗?
arr.reduce(() => {})
const userList = [
{
id: 1,
username: 'john',
sex: 1,
email: 'john@163.com'
},
{
id: 2,
username: 'jerry',
sex: 1,
email: 'jerry@163.com'
},
{
id: 3,
username: 'nancy',
sex: 0,
email: 'nancy@163.com'
}
];
let result = userList.reduce((pre, current) => {
return {...pre, [current.id]: current};
}, {});
console.log(result);
JS 闭包 什么是内存泄漏 那 V8 引擎的垃圾回收机制 从整个 V8 垃圾回收机制来讲:你还有什么要说的、有补充吗? 简单讲一下js的执行原理:Even Loop 做题:事件循环题目输出顺序 说一下浏览器的缓存机制 Etag 和 last-modified :为什么 会出现 Etag, Etag 比 last-modified 好在哪里?Etag 它解决了什么问题? JS Bridge :web 和 native 通信的桥梁,原理能讲一下 项目相关的问题:balabala 说一下 你这个几个项目比较有成就感的、比较复杂的问题, 挑一个 详细讲一下,就行 项目相关的问题:balabala 那我这有一个问题:后端的数据 怎么跟组件 关联起来的呢?比如你现在渲染一个下拉菜单,菜单里有a/b/c ,下拉组件 select 怎么 a/b/c关联起来的 项目相关的问题:balabala 算法:最长不重复字符串的长度 反问 PC、移动、Vue、React 看不同的项目 简单介绍业务 非常感谢你投递探探,今天就到这里,后续的话,如果有二面其他的,hr 会联系您
腾讯云智
腾讯云智(深圳)TEG 客服系统
前端一面(通过)
自我介绍 离职还是在职? 在这个项目中主要负责哪些模块 主要用的前端哪一些技术实现的呢? 你们低代码,它是怎么的一个流程? 有没有考虑过,其他的UI框架,或者说,其他的渲染模式呢? 也就是说你们现在是基于React做了一些开发是吧,还没有扩展到Vue、或者是原生的JS?或者说是一些其他的框架上是吗? 你们的数据结构变更,有做什么版本管理的东西吗? 有没有类似于 diff 的功能:撤回、重做 版本管理是有的,有没有做过性能方面的监控呢?比如用户做了一些某一些组件,生成了某一些页面,运行方面的数据,性能这方面有吗? 性能优化 它的运行的时候,出现的异常是怎么捕获的? 除了你刚才说的,你有做过一些业务吗? 你们用的类组件还是 hook函数组件 这个边界你们是怎么判定的呢?什么时候该用类组件,什么时候用hooks 类组件 和 hooks 区别 hooks 组件、hooks怎么去管理组件的状态的?怎么做到哪些不同作用域之间的分割,以及 逻辑复用的问题? 你平时会写 JSX 语法多吗? JSX 是通过 什么工具 去编译 JSX 编译之后是什么结构? React 生成的节点 它可以通过 ReactDom 去渲染, 你能自己写一个 类似 ReactDom.render 的解析器吗? 用 React 创建一个节点,它不一定只能在 react 中使用,你也可以自己写一些解析器,是不是? React 为什么需要 ReactDOM? 你平时有接触过 Vue 吗? React 和 Vue 有一个共同的说法,都说是渐进式的框架?你觉得渐进式是指什么意思? React 可以多次调用 ReactDOM.render 吗? React 是不是可以用 类似插件的机制,新增一个功能:这就是 React 和 Vue 的渐进式功能所在,可以细化到某一个dom 元素,渐进式特性。它们两者 的都是一样的,你给我一个容器,就可以 基于这个容器实现对应的功能,不用你对整个前端的项目做一个重构吧,可以慢慢的嵌入你的系统,从一个小的节点开发,慢慢的覆盖你的系统。。。渗透到系统其他的地方 react 的类组件可以写一些公共的类,作为 公共继承的对象吗? 在 JS继承有哪些方式,比如ES5 平时 用到 类的继承这一种特性吗?或者用到原型链相关的方法 你觉得哪一些场景的情况下用继承会比较好 实现需求:自动播放轮播图,隔个2s,跳到下一张:怎么去做这个 轮播图的切换动效怎么实现 它如果还需要 有一个 首位相连的效果怎么实现?比如最后一张切换到第一张 反问: 主要的技术栈是React 目前主要做的业务:TEG客服部,打造自己的客服平台,承接所有反馈 工作时间、节奏
前端二面(挂)
全程 50分钟都在问项目,没有八股文。
简单的自我介绍 你现在是在职吗 换工作的原因 那你现在在面试哪些公司?有没有拿到offer? 你现在做的偏工具类,后续想不想做一下偏业务类的 低代码都有哪些组件 低代码都有哪些能力 有两个下拉框,值发生改变时,在你们低代码里面是怎么实现联动的? 你们的schema都有哪一些数据呢? 此处省略 N 个项目相关的问题!!! 有做什么性能优化吗 反问: 部门:腾讯集团下的人工客服服务部 负责项目:各种客服平台系统 技术栈:react 工作节奏:早9.30,晚8点
腾讯证券系统
腾讯(腾卓)证券系统,深圳,光启未来中心
前端一面(挂)
全程聊项目,一个半小时,没有八股文。后因为我有下一场面试,主动取消,并跟面试官说明原因
金蝶
2面需要到深圳现场,主动取消面试
美图秀秀
深圳,海外事业部
前端一面(通过)
自我介绍 介绍之前做过的一些项目 现在是在职吗 看机会的原因 你现在主要是做 xxx,下一份工作是比较往哪一个方向去发展呢?想尝试哪些方向 有技术难点的项目或者是某一个东西,可以跟我分享一下吗?你是怎么去解决这个问题的呀 项目问题:balabala react 技术栈、用的哪个版本 像react的话,一般做性能优化是怎么去做的? useState 直接 setState 和 setState 传入一个函数做处理,这个两者的区别 setState 是同步的还是异步的 你觉得 为什么会出现 hooks?它有什么优势吗 react fiber 有没有 了解?解决了什么问题 react fiber 和 hooks 有什么关联? react 18 的新特性有没有去了解?新特性的出现,它们是解决了什么样的问题? node 有使用过吗?node的服务器有玩过 webpack 5 有什么新的特性 介绍一下模块联邦 自定义 webpack 做了一件什么事情,解决了什么问题 除了 webpack,还了解其他 构建工具吗? vite 相关的了解,与 webpack区别 像 webscoket 有实践过吗?它是怎么建立连接的? csrf 与 xss 的了解 cookie 的 samesite OK,我这边了解得差不多了,你看一下有什么想问我的吗? 反问 主要技术栈 react、next、node 主要做的业务和项目:海外事业部,国外用户,多语言限制,没有小程序应用,都是网页或者是原生的客户端 AIGC 业务:balabala 工作节奏:1075 ok,我们今天聊到这,后序有消息的话,会有HR联系你
前端二面(通过)
美图秀秀的二面和百度三面、58二面差不多,聊人生,最前沿的技术、chatgpt等。
HR(通过)
58同城
前端一面(通过)
自我介绍 目前还是在职,看机会的原因 如果后面聊得顺利,多久可以到岗 此处省略 N 个项目相关的问题!! 你之前又把它和阿里的低代码引擎对比吗? 你们在做这个低代码的过程中,是怎么做事件的绑定的?有一个按钮,如果我点了按钮之后想 把一段文字填到一个 dom里面?或者类似于两个组件的交互,绑定数据,并且响应时间,是怎么去做这个事情的 mirrorx 和 reudx 有啥区别或者优势 mirrorx 它内部是怎么做的异步? 自定义 webpack 插件,解决了什么问题,大概分几步去实现 你了解过或者用过 哪些webpack 插件 优化 webpack 打包编译 性能 或者体积,可以讲一下吗? 性能优化 拖拽你们是怎么做的碰撞检测这一块的 比如说,你要检测dom 范围内有几层 这个业务组件,你释放的范围内 有哪些业务组件,这个是怎么去监听的 比如你拖到了 一个什么组件内了,这个 dom 上面有哪些,第一层是什么,第二层是什么,这个是怎么去监听的 比如说 我有一个 input,它是怎么检测到是 div1的、还是 div2 的呢,怎么检测到它的父元素这一块 比如说你在拖拽的过程中,是通过这个 元素的长宽 位置这种对比 这种解析到的,还是通过原生的 dom 的api 去做的监听 数组扁平方法 你们是经常手写一些公共的函数吗? 你可以举一个例子,可以体现你的封装能力、设计能力、或者是一些设计模式、或者开发原则 之类的,可以举一个你开发过程中的例子吗? 主要用 React、vue用过吗?大学的时候用过 我们也是 React为主,react hooks 了解哪些或者你用过哪些 useEffect 和 useLayoutEffect react 18 里面的 useTranslation 有过了解吗,它是做什么的 react 18 里面的一些新的特性,它对异步事件的处理变化,优先级这一块,有过了解吗 可以讲一讲 那它是怎么解决有的任务被顶替 优先级事件上的 ? class 组件也有用过,class 组件 发请求是在哪个生命周期 它为什么不放在 componentWillMount ?componentWillMount 存在哪些问题? 你提到服务端渲染嘛? hooks 里面会产生闭包的情况吗:数据更新了,在事件回调里面,或者是某一个使用的绑定的地方,它是没有更新的,类似于setTimeout 或者是一些事件回调里面 那面对闭包,你有哪一些方法能够在回调里或者 setTimeout 拿到最新的状态、最新的值 React的性能优化的手段 有哪些? 你们一般是怎么做 函数的节流和防抖吗? 你是学软件的吗?工作之后学的前端还是之前也学过 你理解为什么引入js 脚本和 css的时候,它们的位置是一头一尾的这种?是从什么方向考虑 css 解析会阻塞dom的解析吗? 你大学学了多久啊,感觉你的基础还挺扎实的 this 指向 整体我感觉还挺好的,而且我们这边也有一些低代码的场景、现在也是正在做 我这边的问题就这些,你想了解什么,就直接问 反问: 负责的业务或者模块 部门是 xxx 部门,也是中台部门,所以做的一些项目也都是一些中台的项目,包括说SDK类、平台类、还有 node这种数据服务类的,分这几个方向把 具体的业务:审核相关的,机审、人审、还有一些安全相关的,比如说扫描验证码,人脸识别、环境监测之指纹、代码混淆加密、加密签名。。。 js代码的加固,都是安全相关的一些项目把 广告、中台 主要技术栈:React、 umi 目前在做的事:低代码方向的尝试、微前端尝试 安全:sdk 项目 平时工作节奏:早上 10点、晚上8 9 点下班 部门多少人:前端 x 人 希望后面有机会可以共事
前端二面(通过)
自我介绍 技术方案 你在这个项目中承担的是一个怎么样的角色? 你们项目是怎么分工的? 深挖项目 都有哪些人在用你们这个平台 有没有和阿里、百度的低代码做对比吗? 你们的低代码,和市面上其他的相比,有什么异同? ............ 有没有关注最前沿技术 聊人生 读过哪些书
HR 面(挂)
要了 30% 以上的涨幅 告知 HR,已经拿了其他的offer,在做对比 没有下文
美团
前端一面(通过)
自我介绍 比较有难点或者是比较有挑战的地方 项目相关问题:balabala 有没有对比、对标过市面上的同类产品 低代码都有什么功能,有哪些能力,有哪些人在使用 做过的一些性能优化,展开讲一下 用什么技术栈?状态管理用的哪个 离职原因 学习前端的渠道?你遇到问题是怎么解决的? 关注哪些技术博客,哪些公众号,哪些开源项目 介绍一下强缓存和协商缓存 http1、http2、http3的区别 set 和 weakSet 的区别、是否可以遍历 弱引用 闭包、v8:balabala 垃圾回收机制 介绍常用的 Promise 方法 简单描述一下如何手写实现 Promise Promise.resolve 的相关问题 react hooks 出现的原因 简单介绍一下 react fiber react 函数组件和类组件的区别 react 的生命周期 react 的严格模式 介绍一下常用的设计模式 对 node 有了解吗? 项目相关问题:balabala 对 linux、nginx 有了解吗 对 chatgpt、AI 的看法 代码题:判断一个IPv4合法性 反问: 主要用的技术栈:react 现在做的一些项目和业务 工作节奏:1085
前端二面(通过)
自我介绍 面试官向我介绍了 他们当前部门的情况,做的业务,技术栈、团队规模等 介绍低代码相关的搭建 介绍一下你参与过的项目难点、亮点 项目相关问题:balabala 低代码项目做了多久、项目大概多少人 有没有对比过其他低代码产品,了解其他低代码的实现吗? react 函数组件和类组件的区别 react 高阶组件、render props 区别 webpack 基本原理 webpack 热更新的原理 对 vite 的了解,与 webpack 的区别 webpack 的构建优化 loader 和 plugins 的作用 怎么自定义webpack 插件? 项目中自定义的webpack 插件 解决了什么问题?
接下来做三道题:
第一题:闭包相关(做出来了)
function foo(){
console.log(a);
}
function bar(){
var a = 3;
console.log(this.a + a);
foo();
}
var a = 2;
bar();
bar.call({a: 4})
第二题:事件循环,看输出顺序(做出来了)
console.log('1');
async function async1() {
console.log('2');
await console.log('3');
console.log('4');
}
setTimeout(function () { console.log('5') }, 0)
async1();
new Promise(function (resolve) {
console.log('6');
resolve(6);
}).then((x) => console.log(x))
console.log('8')
第三题:高亮关键词,10 个约束条件,还是有一定的难度的(写了20多分钟,完成 60%-70%) 现在在哪个城市,住在哪里 现在都在面哪些公司,手上都有哪些公司的offer 你对未来的团队有什么期望?喜欢什么样的团队 反问
HR 面(挂)
一二面技术通过,HR 面挂,要了将近 dobule 的总包,期望涨幅太高了,挂!